<template>
  <v-sheet color="overall">
    <v-container>
      <v-sheet class="rounded-lg pb-5 mt-5">
        <v-sheet
          class="text-start rounded-t-lg fontwhite--text py-5 px-10"
          color="appbar"
          ><span class="text-h5 text-md-h4">极速问诊</span
          ><span class="text-caption text-md-body-2 pl-5">
            10000+三甲专家，3分钟极速接诊（三甲专家/3分钟接诊/19元）</span
          ></v-sheet
        >
        <inquiry></inquiry>
        <v-sheet class="d-flex rounded-lg py-2">
          <sidebar></sidebar>
          <recommend-doctor></recommend-doctor>
        </v-sheet>
      </v-sheet>
      <v-sheet class="mt-5">
        <v-sheet
          class="text-start rounded-t-lg fontwhite--text py-5 px-10"
          color="appbar"
          ><span class="text-h5 text-md-h4">预约挂号</span
          ><span class="text-caption text-md-body-2 pl-5"
            >快速预约，便捷就医！（费用由医院自行设定，平台不收取任何额外费用）</span
          ></v-sheet
        >
        <hospital></hospital>
      </v-sheet>
      <v-sheet class="mt-5">
        <v-sheet
          class="text-start rounded-t-lg fontwhite--text py-5 px-10"
          color="appbar"
          ><span class="text-h5 text-md-h4">健康资讯</span
          ><span class="text-caption text-md-body-2 pl-5"
            >关注健康，享受生活！</span
          ></v-sheet
        >
        <div class="d-flex flex-wrap">
          <div class="col-12 col-md-6" v-for="n in 4" :key="n">
            <consult :picUrl="getPicUrl(n)"></consult>
          </div>
        </div>
      </v-sheet>
    </v-container>
  </v-sheet>
</template>



<script>
import Carousels from "../components/home/carousels.vue";
import Inquiry from "../components/home/inquiry.vue";
import RecommendDoctor from "../components/home/RecommendDoctor.vue";
import sidebar from "../components/home/sidebar .vue";
import hospital from "../components//home/hospital.vue";
import Consult from "../components/home/consult.vue";
export default {
  components: {
    sidebar,
    Carousels,
    RecommendDoctor,
    Inquiry,
    hospital,
    Consult,
  },
  methods: {
    getPicUrl(index) {
      switch (index) {
        case 1:
          return require("../../public/img/ohter/1.jpg");
        case 2:
          return require("../../public/img/ohter/2.jpg");
        case 3:
          return require("../../public/img/ohter/3.jpg");
        case 4:
          return require("../../public/img/ohter/4.jpg");
      }
    },
  },
};
</script>

<style lang="scss" scoped>
</style>
